import {createRouter, createWebHistory} from 'vue-router'
//import Home from '@/components/Home'
import News from '@/components/News'
import Books from '@/components/Books'
import Videos from '@/components/Videos'
import Book from '@/components/Book'
import Login from '@/components/Login'

const router = createRouter({
  //history: createWebHashHistory(),
  history: createWebHistory(),
  routes: [
    {
      path: '/',
      redirect: {
        name: 'news'
      }
    },
    {
      path: '/news',
      name: 'news',
      component: News,
      meta: {
        title: '新闻'
      }

    },
    {
      path: '/books',
      name: 'books',
      component: Books,
      meta: {
        title: '图书列表'
      }
      /*
      children: [
        {path: '/book/:id', name: 'book', component: Book, props: true}
      ]*/
    },
    {
      path: '/videos',
      name: 'videos',
      component: Videos,
      meta: {
        title: '视频',
      }
    },
    {
      path: '/book/:id',
      name: 'book',
      meta: {
        title: '图书'
      },
      components: {bookDetail: Book},
    },
    {
      path: '/login',
      name: 'login',
      component: Login,
      meta: {
        title: '登录'
      }
    }
  ]
})

router.beforeEach(to => {
  //判断目标路由是否是/login，如果是，则直接返回true
  if(to.path == '/login'){
    return true;
  }
  else{
    //否则判断用户是否已经登录，注意这里是字符串判断
    if(sessionStorage.isAuth === "true"){
      return true;
    } 
    //如果用户访问的是受保护的资源，且没有登录，则跳转到登录页面
    //并将当前路由的完整路径作为查询参数传给Login组件，以便登录成功后返回先前的页面
    else{
      return {
        path: '/login',
        query: {redirect: to.fullPath}
      }
    }
  }
})

router.afterEach(to => {
  document.title = to.meta.title;
})

export default router